<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>密码找回</title>
    <script src="${pageContext.request.contextPath}/jq/jquery-3.3.1.js"></script>
    <script src="${pageContext.request.contextPath}/jq/jquery.growl.js"></script>
    <link href="${pageContext.request.contextPath}/jq/jquery.growl.css" rel="stylesheet">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/bcss/bootstrap.css">
    <script src="${pageContext.request.contextPath}/bootstrap/js/bootstrap.js"></script>
    <link href="${pageContext.request.contextPath}/layui/css/layui.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
    <style>
        body{
            background-color: #dcc9dd;
        }
    </style>
</head>
<body>
     <div>
         <%@include file="/WEB-INF/jsp/header.jsp"%>
     </div>
     <div class="container">
         <br>
         <div class="text-center">
             <h2>您正在进行密码找回</h2>
         </div>
         <br><br>
         <form>
             <div class="form-group">
                 <label for="username">您的账号</label>
                 <input type="password" class="form-control" id="username" placeholder="请输入需要找回的账号">
             </div>
             <div class="form-group">
                 <label for="email">您的邮箱</label>
                 <input type="email" class="form-control" id="email" aria-describedby="emailHelp">
                 <small  class="form-text text-muted">请确保所填的信息正确</small>
             </div>
             <div class="form-group">
                 <label for="phone">您的电话</label>
                 <input type="text" class="form-control" id="phone" aria-describedby="emailHelp">
                 <small  class="form-text text-muted">请确保所填的信息正确</small>
             </div>
             <div class="form-group">
                 <label for="password">新密码</label>
                 <input type="password" class="form-control" id="password" placeholder="一个全新的密码">
             </div>
             <div class="form-group">
                 <label for="repassword">重复输入新密码</label>
                 <input type="password" class="form-control" id="repassword" placeholder="怕输错了？没关系，再来一遍">
             </div>
             <div class="text-center">
                 <button type="button" class="btn btn-primary" onclick="find()">尝试找回</button>
             </div>
         </form>
     </div>
     <div>
         <%@include file="/WEB-INF/jsp/footer.jsp"%>
     </div>
     <script>
         function find() {
             var username = $("#username").val();
             var phone = $("#phone").val();
             var email = $("#email").val();
             var repassword = $("#repassword").val();
             var password = $("#password").val();
             if(password==''||repassword==''){
               alert("先输入密码阿亲")
             }else if(password==repassword){
                 $.ajax({
                     url:"${pageContext.request.contextPath}/find",
                     method:"POST",
                     data:{
                         username:username,
                         phone:phone,
                         email:email,
                         password:password
                     },
                     dataType:"JSON",
                     success:function (data) {
                         console.log(data);
                         if(data.message === "ok"){
                             alert("找回成功！可以去登录啦");
                             location.href = "${pageContext.request.contextPath}/login";
                         }else {
                             alert("信息不对哦！找回失败");
                         }
                     },
                     error:function (data) {
                        console.log(data);
                     }
                 })
             }else {
                 alert("两次输入的密码不一致！")
             }
         }
     </script>
</body>
</html>
